<%@ include file="/WEB-INF/jsp/include.jsp"  %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<c:choose>
    <c:when test="${recipe.id > 0}">
        <c:set var="page_title"  value="view/edit dish recipe"/>
    </c:when>
    <c:otherwise>
        <c:set var="page_title"  value="add new dish recipe"/>
    </c:otherwise>
</c:choose>
<html>
<head>
    <title><c:out value="${page_title}"/></title>
    <c:url var="jquery_custom_css" value="/ui/jquery-ui-1.8.4.custom.css" />
    <link href="${jquery_custom_css}" rel="stylesheet" type="text/css" />
    <c:url var="jquery_treeview_css" value="/css/jquery.treeview.css" />
    <link href="${jquery_treeview_css}" rel="stylesheet" type="text/css" />
    <c:url var="housewifes_css" value="/css/housewifes.css" />
    <link href="${housewifes_css}" rel="stylesheet" type="text/css" />

    <c:url var="jquery_js" value="/script/jquery-1.4.2.js" />
    <script type="text/javascript" src="${jquery_js}"></script>
    <c:url var="jquery_cookie_js" value="/script/jquery.cookie.js" />
    <script type="text/javascript" src="${jquery_cookie_js}"></script>
    <c:url var="jquery_treeview_js" value="/script/jquery.treeview.js" />
    <script type="text/javascript" src="${jquery_treeview_js}"></script>
    <c:url var="jquery_custom_js" value="/script/jquery-ui-1.8.4.custom.min.js" />
    <script type="text/javascript" src="${jquery_custom_js}"></script>

    <c:url var="hw_js" value="/script/housewifes.js" />
    <script type="text/javascript" src="${hw_js}"></script>

</head>
<body>
<c:import url="../pagemenus/mainUserMenu.jsp"/>
<br/>
<h3><c:out value="${page_title}"/></h3>

<form action="<c:url value="/eatingmenu-recipes-edit.html"/>" method="post">
    <input type="hidden" name="id" value="${recipe.id}"/>
    <input type="hidden" name="usersTableId" value="${usersTableId != null ? usersTableId : 0}"/>
    <input type="hidden" name="dayMenuId" value="${usersTableId != null ? usersTableId : 0}"/>
    <input type="hidden" name="eatingMenuId" value="${eatingMenuId != null ? eatingMenuId : 0}"/>
    <table>
        <tr>
            <td>name</td>
            <td>
                <spring:bind path="recipe.name">
                    <form:input path="recipe.name"/>
                    <c:out value="${status.errorMessage}"/>
                </spring:bind>
            </td>
        </tr>
        <tr>
            <td>wayToPrepare</td>
            <td>
                <spring:bind path="recipe.wayToPrepare">
                    <form:textarea path="recipe.wayToPrepare" rows="10" cols="50"/>
                    <c:out value="${status.errorMessage}"/>
                </spring:bind>
            </td>
        </tr>
        <tr>
            <td>group</td>
            <td>
                <form:hidden path="recipe.group.id" id="recipe_group_id_hidden"/>
                <span id="recipe_group_name_id"><c:out value="${recipe.group.name}"/></span>
                <span class="dialog_link select_group_dialog">select group</span>
            </td>
        </tr>
        <tr>
            <td colspan="2">
                components:
                <table border="1">
                    <tr>
                        <td>
                            <c:if test="${empty recipe.uiComponents}">
                                <c:set var="inputCmpTemplate" value="${recipe.uiComponents[1]}"/>
                            </c:if>
                            <c:set var="inputCmpTemplate" value="${recipe.uiComponents[0]}"/>
                            <div id="components_container">
                                <c:set var="cmpsKeyMax" value="${0}" />
                                <c:set var="cmpsKeys" value="" />
                                <c:forEach var="entry" items="${recipe.uiComponentsEntries}" varStatus="status">
                                    <c:set var="componentValue" value="${entry.value}"/>
                                    <c:set var="componentKey" value="${entry.key}"/>
                                    <div class="cmp_input-${componentKey} delete-target">
                                        <form:hidden path="recipe.uiComponents[${componentKey}].id"/>
                                        <table>
                                            <tr>
                                                <td>ingredient:
                                                    <span id="recipe_uiComponents_${componentKey}_ingredient_name"><c:out value="${componentValue.ingredient.name}"/></span>
                                                    <form:hidden path="recipe.uiComponents[${componentKey}].ingredient.id" id="recipe_uiComponents_${componentKey}_ingredient_id"/>
                                                    <span class="dialog_link select_ingred_dialog_lnk"><span class="hidden_id">[${componentKey}]</span>select ingredient</span>
                                                    preferable Ware:
                                                    <c:set var="userWare" value="${usersWaresMap[componentValue.preferableWare.id]}"/>
                                                    <span <c:if test="${componentValue.preferableWare.id <= 0}">class="hidden_span"</c:if> id="recipe_uiComponents_${componentKey}_preferable_ware_span">
                                                        <span id="recipe_uiComponents_${componentKey}_ware_name"><c:out value="${componentValue.preferableWare.name}"/></span>
                                                        (
                                                        <span class="region_price"><c:out value="${userWare != null ? userWare.wareRegionPriceStrValue : '-'}"/></span> /
                                                        <span class="dialog_link select_user_price">
                                                            <span class="hidden_id">${userWare != null ? userWare.id : ""}</span>
                                                            <span class="hidden_span ware_name">${userWare != null ? userWare.ware.name : ""}</span>
                                                            <span class="users_ware_price_${userWare != null ? userWare.id : ""}"><c:out value="${userWare != null ? userWare.wareUserPriceStrValue : '-'}"/></span>
                                                        </span>
                                                        )
                                                        <form:hidden path="recipe.uiComponents[${componentKey}].preferableWare.id" id="recipe_uiComponents_${componentKey}_ware_id"/>
                                                        <span class="dialog_link select_ware_dialog_lnk"><span class="hidden_id">[${componentKey}]</span>select ware</span>
                                                    </span>
                                                </td>
                                                <td>count:
                                                    <form:input path="recipe.uiComponents[${componentKey}].count"/>
                                                </td>
                                            </tr>
                                        </table>
                                    </div>
                                    <c:set var="cmpsKeyMax" value="${cmpsKeyMax < componentKey ? componentKey : cmpsKeyMax}" />
                                    <c:set var="cmpsKeys" value="${cmpsKeys}${(status.first ? ' ' : ', ')}${componentKey}" />
                                </c:forEach>
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <input type="button" class="component-add" style="width: 7em;" value="Add" />
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
    <input type="submit" value="SAVE">
</form>

<div id="dialog_container0" style="display:none;">
    <div id="ingredients_select_dialog">loading ingredients groups...</div>
</div>

<div id="dialog_container1" style="display:none;">
    <div id="wares_select_dialog">loading wares groups...</div>
</div>

<div id="dialog_container2" style="display:none;">
    <div id="recipe_group_select_dialog">loading wares groups...</div>
</div>

<c:import url="../prices/setUsersWarePriceDialogBlock.jsp"/>

<script type="text/javascript">

    $(document).ready(function() {
        var isd = new IngredientsSelectDialog("ingredients_select_dialog", "<c:url value="/get-select-ingredients-form.html"/>", "<c:url value="/get-ingredients-list.html"/>");
        var wsd = new WaresSelectDialog("wares_select_dialog", "<c:url value="/get-select-wares-form.html"/>", "<c:url value="/get-wares-list.html"/>");

        //--- wares prices manage:
        var priceDialog = new WareUserPriceSetDialog(
                "<c:url value="/set-users-ware-price.html"/>",
                "set_users_ware_price_form",
                "set_price_form_ware_id",
                "set_price_form_ware_name",
                "set_price_form_ware_price"
        );

        priceDialog.bindSubmitPriceAction(function(wareId, warePrice) {
            $(".users_ware_price_" + wareId).html(warePrice);
        });

        var componentsKeys = [${cmpsKeys}];

        var addIngredientAndWareSelectDialog = function (index) {
            $("#components_container .cmp_input-" + index + " .select_ingred_dialog_lnk").click(function(){
                var componentKey = $(this).children(".hidden_id").text();
                componentKey = componentKey.substr(1, componentKey.length - 2);
                isd.onIngredientDialogLinkClick(function(ingredient, defWaresViews) {
                    var ingredientId = ingredient["id"];
                    var ingredientName = ingredient["name"];
                    var wareId = ingredient["defaultWare"]["id"];
                    var wareName = ingredient["defaultWare"]["name"];
                    var regionPrice = defWaresViews[wareId]["regionPrice"];
                    var userPrice = defWaresViews[wareId]["userPrice"];

                    $("#recipe_uiComponents_" + componentKey + "_ingredient_id").val(ingredientId);
                    $("#recipe_uiComponents_" + componentKey + "_ingredient_name").html(ingredientName);

                    var prefWareSpan = $("#recipe_uiComponents_" + componentKey + "_preferable_ware_span");
                    prefWareSpan.removeClass("hidden_span");
                    $("#recipe_uiComponents_" + componentKey + "_ware_id").val(wareId);
                    $("#recipe_uiComponents_" + componentKey + "_ware_name").html(wareName);

                    prefWareSpan.find(".region_price").html(regionPrice);

                    var selectUserPriceSpan = prefWareSpan.find(".select_user_price");
                    var prevWareId = selectUserPriceSpan.children(".hidden_id").text();
                    selectUserPriceSpan.children(".hidden_id").html(wareId);
                    selectUserPriceSpan.children(".ware_name").html(wareName);
                    var usersWarePriceSpan = selectUserPriceSpan.find(".users_ware_price_" + prevWareId);
                    usersWarePriceSpan.removeClass("users_ware_price_" + prevWareId);
                    usersWarePriceSpan.addClass("users_ware_price_" + wareId);
                    usersWarePriceSpan.html(userPrice);
                });
//                isd.onIngredientDialogLinkClick("recipe_uiComponents_" + componentKey + "_ware_id", "recipe_uiComponents_" + componentKey + "_ware_name");
            });

            $("#components_container .cmp_input-" + index + " .select_ware_dialog_lnk").click(function(){
                var componentKey = $(this).children(".hidden_id").text();
                componentKey = componentKey.substr(1, componentKey.length - 2);
                var ingredientId = $("#recipe_uiComponents_" + componentKey + "_ingredient_id").val();

                wsd.onWareDialogLinkClick(ingredientId, function(wareView) {
                    var wareId = wareView['ware']['id'];
                    var wareName = wareView['ware']['name'];
                    var regionPrice = wareView['regionPrice'];
                    var userPrice = wareView['userPrice'];
                    $("#recipe_uiComponents_" + componentKey + "_ware_id").val(wareId);
                    $("#recipe_uiComponents_" + componentKey + "_ware_name").html(wareName);

                    var prefWareSpan = $("#recipe_uiComponents_" + componentKey + "_preferable_ware_span");
                    var prevWareId = prefWareSpan.find(".select_user_price").find(".hidden_id").text();
                    prefWareSpan.find(".ware_name").html(wareName);
                    prefWareSpan.find(".region_price").html(regionPrice);
                    prefWareSpan.find(".select_user_price").find(".hidden_id").html(wareId);
                    var usersWarePriceSpan = prefWareSpan.find(".select_user_price").find(".users_ware_price_" + prevWareId);
                    usersWarePriceSpan.removeClass("users_ware_price_" + prevWareId);
                    usersWarePriceSpan.addClass("users_ware_price_" + wareId);

                    usersWarePriceSpan.html(userPrice);
                });
            });
            $("#components_container .cmp_input-" + index + " .select_user_price").each(function(){
                var selectUserPricePointer = $(this);
                $(this).click(function() {
                    var wareId = selectUserPricePointer.children(".hidden_id").text();
                    var wareName = selectUserPricePointer.children(".ware_name").text();
                    var wareCurPriceSpan = selectUserPricePointer.children(".users_ware_price_" + wareId);
                    priceDialog.showDialogForm(wareId, wareName, function(){
                        var wareCurPrice = wareCurPriceSpan.text();
                        if (wareCurPrice == "<spring:message code="ware.user.price.not.found"/>") {
                            wareCurPrice = 0;
                        }
                        return wareCurPrice;
                    });
                });
            });
        };

        var cmpIndex = ${cmpsKeyMax} + 1;
        var cmpHtml = $('#components_container .cmp_input-0').html();
        $('#components_container .cmp_input-0').remove();

        for (var j in componentsKeys) {
            var componentKey = componentsKeys[j];
            addIngredientAndWareSelectDialog(componentKey);
        }
        <%--addIngredientAndWareSelectDialog(${cmpsKeyMax});--%>

        $(".component-add").live('click', function() {
            var index = cmpIndex++;
            var html = cmpHtml;
            html = html.replace(/\[0\]/g, '[' + index + ']');
            html = html.replace(/uiComponents_0/g, 'uiComponents_' + index);
            html = html.replace(/uiComponents0/g, 'uiComponents' + index);
            var dv = $('#components_container').append($('<div></div>').addClass('cmp_input-' + index).addClass('delete-target').append($(html)));

            addIngredientAndWareSelectDialog(index);
            return false;
        });

        var rgsd = new RecipeGroupsSelectDialog("recipe_group_select_dialog", "<c:url value="/get-select-recipe-groups-form.html"/>");

        $(".select_group_dialog").click(function() {
            rgsd.onRecipeGroupDialogLinkClick(function(groupId, groupName) {
                $("#recipe_group_id_hidden").val(groupId);
                $("#recipe_group_name_id").text(groupName);
            });
        });

    });

</script>

</body>
</html>